<div class="add_form">
    <textarea name="describe" cols="" rows=""  class="ftextarea focus font14"  placeholder="请在这里输入你的问题" ></textarea>  
  <div class="other">
  	<div class="addimg"></div>
  </div>
  
   <div class="imgbox">
    
	<div class="ili add"></div>
		 <input id="browseFile" type="file" style="display: none;">
  </div> 
  
  
  
  <div class="selbox J_select_cat">
    <div class="tit">问题分类：</div>
    <div class="txt">
	<span class="J_cat_cn">请选择分类</span>
	<input name="category1" type="hidden" value="0" />
	<input name="category2" type="hidden" value="0" />
	</div>
  </div>
  
  <div class="tags_tit">选择标签：</div>
  <div id="tags_list" class="tags font10">
	  
      <div class="refresh_tag" id="J_get_tags">换一批</div>
    </div>
	
	 <div class="tags_tit">已选标签：</div>
	 <div id="tags_checked" class="tags font10">
    </div>
 
  
</div>
<script>
$('.focus').focus();
$(".J_select_cat").on("click", function(){
	 select_classify(1,0);
});
</script>
<script>
    // 提交数据
    var postData = {};
    $(function () {
        // 提交问题
        $(".J_confirm").on('click', function(){

            var btn=$(this);
            if (btn.hasClass('disabled')) {
                return false;
            }
            btn.addClass('disabled');
            postData.category1 = $("input[name='category1']").val();
            postData.category2 = $("input[name='category2']").val();
            postData.title = '';
            postData.describe = $("textarea[name='describe']").val();
            var imgs = $("input[name='imgs[]']").map(function () {
                return $(this).val();
            }).get();
            postData.img = imgs;
            var cktags = $("input[name='tags[]']").map(function () {
                return $(this).val();
            }).get();
            postData.tag = cktags;
            if (postData.describe==''){
                toast('请填写问题描述');
                btn.removeClass('disabled');
                return false;
            }
            if (postData.category1=='0'){
                toast('请选择分类',0);
				select_classify(1,0);
                btn.removeClass('disabled');
                return false;
            }

            $.post('{:U("wechat/question/ajax_question_save")}', postData, function(res){
                if (res.code == 0) {
                    toast(res.msg);
                } else {
                    toast(res.msg, 1);
                    setTimeout(function () {
                        window.location.reload();
                    }, 1800);
                }
            });
        });

        // 添加图片
        $('.imgbox .ili.add,.addimg').on('click', function(){
            var imgNum = $(".imgbox .ili:not(.add)").length;
            if (imgNum >= 3) {
                toast('最多只能上传3张图片');
            } else {
                $("#browseFile").trigger('click');  // 触发选择图片上传
            }
        });

        // 上传图片
        $('#browseFile').localResizeIMG({
            width: 400,
            quality: 1,
            success: function (result) {
                var submitData={
                    base64_string:result.clearBase64,
                };
                NProgress.start();
                $.ajax({
                    type: "POST",
                    url: "{:U('wechat/ajax/ajax_upload_img')}",
                    data: submitData,
                    dataType:"json",
                    success: function(res){
                        var img = '<div class="ili"><img src="'+res.data.src+'"><input type="hidden" name="imgs[]" value="'+res.data.id+'"></div>';
                        $(".imgbox .ili.add").before(img);
                        refreshImgbox();
                        removeImg();
                    },
                    complete :function(XMLHttpRequest, textStatus){},
                    error:function(XMLHttpRequest, textStatus, errorThrown){}
                });
            }
        });

        
        

        /* 获取标签列表 */
        var page = 0;
        $("#J_get_tags").on('click', function(){
            $.getJSON('{:U("wechat/question/ajax_get_tags")}', {p: page+1}, function (res) {
                var list = res.data.tags;
                var $tags = $("#tags_list");
                $tags.find('.tli').remove();  // 清空候选标签
                for (var i in list) {
                    var tag = list[i];
                    $tags.find('.refresh_tag').before('<div class="tli">'+tag+'</div>');
                }
                page = res.data.page;
                refreshCkTags();
                selectTag();
            });
        }).trigger('click');

        /* 删除已选择标签 */
        $("#tags_checked").on('click', '.tli', function () {
            $(this).remove();
            refreshCkTags();
        });

        
    });
    

    /* 刷新选中标签 */
    function refreshCkTags() {
        var cktags = [];
        $("#tags_checked .tli").each(function () {
            cktags.push($(this).text());
        });

        $("#tags_list .tli").each(function () {
            if ($.inArray($(this).text(), cktags) === -1) {
                $(this).removeClass('select');
            } else {
                $(this).addClass('select');
            }
        });
    }
    
    /* 刷新已选图片容器 */
    function refreshImgbox() {
        var $imgbox = $(".imgbox");
        var imgNum = $(".imgbox .ili:not(.add)").length;
        if (imgNum > 0) {
            $imgbox.show();
        } else {
            $imgbox.hide();
        }
    }

    /* 移除图片 */
    function removeImg() {
        $('.imgbox .ili:not(.add)').off().on('click', function () {
            $(this).remove();
            refreshImgbox();
        });
    }

    /* 选择/取消选择候选标签 */
    function selectTag() {
        $("#tags_list .tli").off().on('click', function () {
            var $cktagsTli = $("#tags_checked .tli");

            var cktags = [];  // 已选中的标签
            $cktagsTli.each(function(){
                cktags.push($(this).text());
            });

            var tag = $(this).text();
            if ($.inArray(tag, cktags) === -1) {
                if ($cktagsTli.length >= 3) {
                    toast('最多只能选择3个标签');
                    return;
                }
                $("#tags_checked").append('<div class="tli">'+tag+'<input type="hidden" name="tags[]" value="'+tag+'">'+'</div>');
            } else {
                $cktagsTli.each(function(){
                    if ($(this).text() == tag) {
                        $(this).remove();
                        return false;
                    }
                });
            }
            refreshCkTags();
        });
    }
    
    refreshImgbox();
    
</script>